<template>
	<div class="app pc-platform default-theme">
		<BothScrollArea
			v-for="i in 100"
			:key="i"
		>
			<div class="content">
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
				<div>这是一段测试内容这是一段测试内容这是一段测试内容!......</div>
			</div>
		</BothScrollArea>
	</div>
</template>

<script>
import BothScrollArea from '@/components/pc/both-scroll-area';

console.time('渲染');
export default {
	name:'Test',
	components:{
		BothScrollArea,
	},
	mounted(){
		console.timeEnd('渲染');
	}
};
</script>

<style lang="scss">
.app{
	display:flex;
	flex-wrap:wrap;
	.lexmis-BothScrollArea{
		width:25%;
		height:150px;
		border:1px solid;
		margin:10px;
		.content{
			white-space:pre;
		}
	}
}
</style>
